import { ChangeDetectionStrategy, Component, Input, OnChanges, OnInit, SimpleChange, SimpleChanges } from '@angular/core';
import { SliderValue, WySliderStyle } from './wy-slider-types';

@Component({
  selector: 'app-wy-slider-handle',
  template: '<div class="wy-slider-handle" [ngStyle]="style"></div>',
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class WySliderHandleComponent implements OnInit, OnChanges {
  @Input() wyVertical = false;
  @Input() wyOffset: SliderValue = 0;
  
  style:WySliderStyle = {};
  constructor() { }
  ngOnChanges(changes: SimpleChanges): void {
    if(changes['wyOffset']){
      this.style[this.wyVertical ? 'bottom': 'left'] = (this.wyOffset || 0) + '%'
    }
  }

  ngOnInit(): void {
  }
}
